import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Spin } from 'antd';
import moment from 'moment';
import RegisterTableC from './registerTableC';

@connect(({ investmentCalendarM, loading }) => ({
  investmentCalendarM,
  loading,
}))
@Form.create()
export default class RegisterC extends PureComponent {
  state = {
    data: {}, //类型：Object  必有字段  备注：无
    date: '', //当前日期
    portfolioCodeList: undefined, //组合list
    currentTime: '', //当前时间戳
  };

  componentDidMount() {}

  UNSAFE_componentWillReceiveProps(nextProps) {
    if (
      this.state.currentTime != nextProps.currentTime ||
      this.state.date != nextProps.date ||
      JSON.stringify(nextProps.portfolioCodeList) !== JSON.stringify(this.state.portfolioCodeList)
    ) {
      this.setState(
        {
          portfolioCodeList: nextProps.portfolioCodeList,
          date: nextProps.date,
          currentTime: nextProps.currentTime,
        },
        () => {
          this.queryRegisterEvents(); //查询登记事件
        },
      );
    }
  }

  //查询登记事件
  queryRegisterEvents = () => {
    const { portfolioCodeList, date } = this.state;
    this.props.dispatch({
      type: 'investmentCalendarM/queryRegisterEvents',
      payload: {
        portfolioCode: portfolioCodeList,
        date: moment(date).format('YYYYMMDD'),
      },
      callback: (msg, data) => {
        if (msg == 'success') {
          this.setState({
            data: data,
          });
        } else {
          this.setState({
            data: {},
          });
        }
      },
    });
  };

  render() {
    const { data } = this.state;
    const { loading } = this.props;
    return (
      <div>
        <Spin spinning={loading.effects['investmentCalendarM/queryRegisterEvents']} tip='加载中...'>
          <RegisterTableC type={'债回售登记'} dataSource={data.bond || []} />
          <div style={{ marginTop: '20px', marginBottom: '20px' }}>
            <RegisterTableC type={'配售登记'} dataSource={data.peiSale || []} />
          </div>
          <RegisterTableC type={'转股登记'} dataSource={data.stockSale || []} />
        </Spin>
      </div>
    );
  }
}
